<template>
	<view class="content">

		<view class="tabs">
			<u-tabs :list="list2" lineWidth="30" lineColor="#fcaf47"
				itemStyle="padding-left:10rpx;padding-right:-50rpx;width:130rpx; height:80rpx; " @click="click"
				:activeStyle="{
		            color: '#101010 100%',
		            fontWeight: 'bold',
		            transform: 'scale(1.05)',
					
		        }" :inactiveStyle="{
		            color: '#9B9B9B 100%',
		            transform: 'scale(1)'
		        }"></u-tabs>
		</view>
		<view class="buttomcard">
			<view @click="gomoyvact()">
				<associationCard_heng v-show="isTabs.name==0" v-for="(item,index) in allData" :item="item"
					:imgId="item.img_id">
				</associationCard_heng>
				<associationCard_heng v-show="isTabs.name==1" v-for="(item,index) in pendingData" :item="item"
					:imgId="item.img_id">
				</associationCard_heng>
				<associationCard_heng v-show="isTabs.name==2" v-for="(item,index) in isInData" :item="item"
					:imgId="item.img_id">
				</associationCard_heng>
					<associationCard_heng v-show="isTabs.name==3" v-for="(item,index) in selfData" :item="item"
						:imgId="item.img_id">
					</associationCard_heng>
			</view>
		</view>

	</view>
</template>

<script>
	import associationCard_heng from '../../components/associationCard_heng.vue'
	export default {
		components: {
			associationCard_heng
		},
		data() {
			return {
				allData:[],
				pendingData:[],
				isInData:[],
				selfData:[],
				target: 0,
				user_Id: this.$store.state.userInfo.id,
				// 当前item位置
				thisindex: 0,
				isTabs: {
					name: '',
				},
				list2: [{
						name: '全部', //设置活动的状态
					},
					{
						name: '审核中',
					},
					{
						name: '已加入',
					},
					{
						name: '所创建的',
					},

				],
			}
		},
		methods: {
			// 切换触发的事件
			toggle(e) {
				let index = e.detail.current
				this.target = index
			},
			click(item) {
			
				this.isTabs.name = item.index;
			},
			// 点击nav控制下面的展示
			setIndex(e) {
				let index = e.currentTarget.dataset.index
				this.thisindex = index
			},
			onClick(item) {
				uni.navigateTo({
					url:'./association?msg='+JSON.stringify(item),
				})
				//携带参数进行传递
			},
			gomoyvact() {
				uni.navigateTo({
					url: '/pages/index/association',
				});
			},
			getAllAssocaiation(){
				let that=this;
				uni.request({
					url:'https://www.codingyt.com/club/userOrganization/select',
					data: {
						userId: that.user_Id,
						role: null,
						organizationId: null,
					},
					success(res) {
						//進行数据的筛选
						var tmpData=res.data.data
						var pendingData=[]
						var isInData=[]
						var selfData=[]
						that.allData=tmpData;
						for (var i = 0; i < tmpData.length; i++) {
							if(tmpData[i].role=='pending'){
								pendingData.push(tmpData[i]);
							}if(tmpData[i].role=='members'){
								isInData.push(tmpData[i]);
							}if(tmpData[i].role=='president'){
								selfData.push(tmpData[i]);
							}
						}
						that.pendingData=pendingData;
						that.isInData=isInData
						that.selfData=selfData
					
					},
				})
			},
		},
		onLoad() {
			this.getAllAssocaiation()
		}
	}
</script>

<style scoped lang="scss">
	@import "@/uni_modules/uview-ui/index.scss";

	.bottomCard {}

	.tabs {
		margin-top: 1%;
		left: 30rpx;
		color: rgba(16, 16, 16, 100);
		font-size: 48rpx;
		position: relative;
	}

	.actCard {
		margin-top: 1%;
		left: 0rpx;
		position: relative;
	}
</style>
